
.plan{
    width: 300rpx;
    height: 300rpx;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
/*
修改复选框默认样式
注意：如果在自定义组件中需要开启样式隔离为
Component({
options:{
    styleIsolation:"shared"//相互影响
    设置shared后会发生：
    1、会修改其他页面，父组件页面，以及其他页面使用了shared和apply-shared的组件
    该如何解决呢？
    1、添加自己的命名空间，就是在默认的class前面增加自己的class名字，让它在自己的某个元素下面
    就是在默认的外面嵌套一个自己的class，但在微信里面可以写到同一个元素上
}
}）
*/

/*
未选中的样式:
 这里虽然用的是后代选择器，但写到了同一个元素上，
 按常规来说应该把.my-checkbox写到.wx-checkbox-input父元素上
 微信支持写到一个上面，但用的是后台选择器，因为.my-checkbox和.wx-checkbox-input
 有空格
*/
.my-checkbox .wx-checkbox-input{
   
//!important:优先级别高
width: 50rpx !important;
height: 50rpx !important;
//设置圆角
border-radius: 50% !important;
//边框设置
border: 1px solid #fda007 !important;
}

/*
选中时的边框样式
*/
.my-checkbox .wx-checkbox-input-checked{
    background-color:#fda007 ;
}
/*选中时的对勾样式*/
.my-checkbox .wx-checkbox-input.wx-checkbox-input-checked:before {
    font-size: 50rpx;//对勾的大小
    color: red;//对勾的颜色
}